﻿import QtQuick 2.15
import QtQuick.Controls 2.15
import Qt.labs.calendar 1.0
import QtGraphicalEffects 1.12
Popup {
    id: root
    property var dateSelectCallBack
    property date currentDate
    height: mainRect.height+header.height
    width: 280
    leftPadding: 0
    topPadding: 0
    rightPadding: 0
    bottomPadding: 0

    Rectangle {
        id: control
        color: 'white'
        width: parent.width
        height: parent.height
        anchors.centerIn: parent
//        layer.enabled: true
//        layer.effect: DropShadow {
//            verticalOffset: 3
//            radius: 8.0
//            samples: 16
//            color: "#5b000000"
//        }
        border.color: '#EEEEEE'
        Item {
            id: header
            anchors.top: parent.top
            height: 44
            width: parent.width
            Button{
                width: 24
                height: 24
                anchors.left: parent.left
                anchors.leftMargin: 17
                anchors.verticalCenter: parent.verticalCenter
                background: Image{
                    source: 'qrc:/images/control/pre_year.png'
                }
                onClicked: {
                    grid.year--
                }
            }
            Button{
                width: 24
                height: 24
                anchors.left: parent.left
                anchors.leftMargin: 50
                anchors.verticalCenter: parent.verticalCenter
                background: Image{
                    source: 'qrc:/images/control/pre_mouth.png'
                }
                onClicked: {
                    if(grid.month==0){
                        grid.month=11;
                        grid.year--
                        return
                    }
                    grid.month--
                }
            }
            Row{
                anchors.centerIn: parent
                spacing: 12
                Text{
                    font.pixelSize: 18
                    anchors.verticalCenter: parent.verticalCenter
                    color: '#000000'
                    text:
                    {
                        let m=''
                        switch(grid.month+1)
                        {
                         case 1:
                             m='一'
                             break
                         case 2:
                             m='二'
                             break
                         case 3:
                             m='三'
                             break
                         case 4:
                             m='四'
                             break
                         case 5:
                             m='五'
                             break
                         case 6:
                             m='六'
                             break
                         case 7:
                             m='七'
                             break
                         case 8:
                             m='八'
                             break
                         case 9:
                             m='九'
                             break
                         case 10:
                             m='十'
                             break
                         case 11:
                             m='十一'
                             break
                         case 12:
                             m='十二'
                             break
                        }
                        return m+'月'
                    }
                }
                Text{
                    anchors.verticalCenter: parent.verticalCenter
                    font.pixelSize: 18
                    color: '#000000'
                    font.family: 'Arial'
                    text: grid.year
                }
            }
            Button{
                width: 24
                height: 24
                anchors.right: parent.right
                anchors.rightMargin: 50
                anchors.verticalCenter: parent.verticalCenter
                background: Image{
                    source: 'qrc:/images/control/nex_mouth.png'
                }
                onClicked: {
                    if(grid.month==11){
                        grid.month=0;
                        grid.year++
                        return
                    }
                    grid.month++
                }
            }
            Button{
                width: 24
                height: 24
                anchors.right: parent.right
                anchors.rightMargin: 17
                anchors.verticalCenter: parent.verticalCenter
                background: Image{
                    source: 'qrc:/images/control/nex_year.png'
                }
                onClicked: {
                    grid.year++
                }
            }
        }
        Rectangle{
            id:mainRect
            anchors.top: header.bottom
            width: parent.width
            height: week_row.height + grid.height
            border.width: 2
            border.color: '#EEEEEE'
            DayOfWeekRow {
                id: week_row
                height:40
                width: parent.width
                topPadding: 0
                bottomPadding: 0
                leftPadding: 0
                rightPadding: 0
                spacing: 0
                locale:Qt.locale("en_US")
                delegate: Text {
                    text:{
                        switch(index){
                        case 0:
                            return qsTr('日')
                        case 1:
                            return qsTr('一')
                        case 2:
                            return qsTr('二')
                        case 3:
                            return qsTr('三')
                        case 4:
                            return qsTr('四')
                        case 5:
                            return qsTr('五')
                        case 6:
                            return qsTr('六')
                        }
                    }

                    font.pixelSize: 18
                    color: "#000000"
                    width: week_row.width/7
                    height: week_row.height
                    horizontalAlignment: Text.AlignHCenter
                    verticalAlignment: Text.AlignVCenter
                }
                contentItem: Rectangle {
                    color: "transparent"
                    Row {
                        anchors.fill: parent
                        spacing: week_row.spacing
                        Repeater {
                            model: week_row.source
                            delegate: week_row.delegate
                        }
                    }
                }
            }
            MonthGrid {
                id: grid
                width: week_row.width
                locale:Qt.locale("en_US")
                anchors.top: week_row.bottom
                //            month:7
                //            year: 2022
                spacing: 0
                delegate: Rectangle {
                    color: mouseArea.containsMouse?'#0B23DB':"transparent"
                    radius: 6
                    enabled: model.month===grid.month
                    Text {
                        anchors.fill: parent
                        text:model.day
                        font.pixelSize: 18
                        horizontalAlignment: Text.AlignHCenter
                        verticalAlignment: Text.AlignVCenter
                        color: {

                            if(model.month!==grid.month)
                            {
                                //不同月
                                return '#B0BECE'
                            }
                            if(mouseArea.containsMouse)
                            {
                                return '#ffffff'
                            }

                            if(date.getDate()===currentDate.getDate()
                                    && date.getMonth() === currentDate.getMonth()
                                    && date.getFullYear() === currentDate.getFullYear())
                            {

                                return '#0B23DB'
                            }
                            return '#000000'
                        }
                    }
                    width:  48
                    height: 40
                    MouseArea{
                        id:mouseArea
                        anchors.fill: parent
                        hoverEnabled: true
                        cursorShape: Qt.PointingHandCursor
                        onClicked: {
                            root.close()
                            if(dateSelectCallBack){
                                dateSelectCallBack(date.toLocaleString(Qt.locale("de_DE"),"yyyy-MM-dd"),date.toLocaleString(Qt.locale("de_DE"),"yyMM"))
                            }
                        }
                    }

                }
            }
        }
//        Item{
//            id:rectSelect
//            anchors.bottom: parent.bottom
//            width: parent.width
//            height: 73
//            Row{
//                anchors.right: parent.right
//                anchors.rightMargin: 17
//                spacing: 9
//                anchors.verticalCenter: parent.verticalCenter
//                Button{
//                    width: 80
//                    height: 40
//                    background: Rectangle{
//                        border.width: 1
//                        border.color: '#1707C9'
//                        radius: 7
//                        Text {
//                            font.pixelSize: 18
//                            color: '#1707C9'
//                            anchors.centerIn: parent
//                            text: qsTr("清空")
//                        }
//                    }
//                }
//                Button{
//                    width: 80
//                    height: 40
//                    background: Rectangle{
//                        border.width: 1
//                        border.color: '#1707C9'
//                        radius: 7
//                        Text {
//                            font.pixelSize: 18
//                            color: '#1707C9'
//                            anchors.centerIn: parent
//                            text: qsTr("今天")
//                        }
//                    }
//                    onClicked: {
//                        currentDate=new Date();
//                        grid.year=currentDate.getUTCFullYear();
//                        grid.month=currentDate.getUTCMonth();
//                    }
//                }
//                Button{
//                    width: 80
//                    height: 40
//                    background: Rectangle{
//                        color: '#1707C9'
//                        radius: 7
//                        Text {
//                            font.pixelSize: 18
//                            color: '#ffffff'
//                            anchors.centerIn: parent
//                            text: qsTr("确定")
//                        }
//                    }
//                }
//            }
//        }
    }

    function show(date){
        root.y=parent.height
        root.x=0
        currentDate=date;
        grid.year=currentDate.getUTCFullYear();
        grid.month=currentDate.getUTCMonth();
        root.open()
    }
}


